<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>

</style>
<body>
<div id="div" style="width: 800px;height: 500px;"></div>
<br>
<br>
<button id="btn1" style="width: 100px;height: 30px;">变红色</button>
<button id="btn2" style="width: 100px;height: 30px;">变蓝色</button>
</body>
<script src="js/jquery-3.6.1.min.js"></script>

<script>

  $('#btn1').click(function(){
    $('#div').css("background", "url(img/1.jpg)");
    $('#div').css("background-size", "100% 100%");
  });
  $('#btn2').click(function () {
    $('#div').css("background", "url(img/2.png)");
    $('#div').css("background-size", "100% 100%");
  });

</script>
</html>